<?php require('pre.inc'); ?>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script id="run" src="js/bgraph.js"></script>
<h1>Linked Open Aalto Lectures</h1>
<p id="load" style="display: inherit;">Loading <img src="load.gif" alt="Loading ..."/></p>
<style type="text/css">
#wrapper {
    width: 1000px;
}

div.inline { display: inline-block; vertical-align:top;}
div.inline a { font-size: 11px;}
.clearBoth { clear:both; }
</style>

<div id="stats">
<div><p>This visualization shows the deviation of lecture counts in a year by Aalto Departments. This page shows the function curve, <strong>Columnchart</strong>-version can be found <a href="lecturecol">here</a></p></div>
<div id="wrapper">
<div class="inline" id="depList"><h1>Aalto departments</h1></div>
<div class="inline"  style="position:fixed; margin-left: 20px; width: 500px; height: 300px">
<b style="visibility: hidden; font-size:12px; color:blue;" id="title"></b>  <a id="reset" style="visibility:hidden;" href="#" onClick="reset()">Reset</a><br/>
<b style="visibility: hidden; font-size:12px; color:red;" id="title2"></b>
<div id="lectures">
<h2 style="color:blue;"><- Select department</h2>
</div>
</div>
</div>
</div>


<script>
google.load("visualization", "1", {packages:["corechart","charteditor"]});
google.setOnLoadCallback(function() {
 $('#load').css("display", "none");
});
	
var bgraph = new BGraph();	
var prefix = bgraph.getPrefixes();
var map;
var infoWindow;
var viz;
var vizdata;

function reset() {
$("#reset").css("visibility", "hidden");
$("#title").css("visibility", "hidden")
$("#title2").css("visibility", "hidden")
vizdata=null;	
viz.clearChart();
}

var qdeps = prefix+"SELECT DISTINCT ?department ?name ?org where { ?department aiiso:code ?code ; foaf:name ?name ; aiiso:teaches ?course ; aiiso:part_of [ foaf:name ?org ] . FILTER(lang(?name)='en' && lang(?org)='en') } GROUP BY ?org ?department ?name ORDER BY desc(?org) ?name";
var q2 = prefix+"SELECT (count(DISTINCT ?course) as ?dCount) (count(?course) as ?count) where { ?course teach:arrangedAt [ical:dtstart ?start].}";

function initialize() {
 printDeps(qdeps);
}

function ajaxQuery(q) {
	return $.ajax({url: "http://data.aalto.fi/sparql?query="+encodeURIComponent(q)+"&format=json"});
}

function printDeps(queryString) {
	ajaxQuery(queryString).done(function(data) {
	//FIXME: Next line is for debugging only
	//data = $.parseJSON(data);

	if(data.results.bindings.length>0) {
		data = data.results.bindings;
	var org = "bogus"
	for(item in data) {
		if(data[item]["org"].value != org) {
			org = data[item]["org"].value;
			$("#depList").append("<h2>"+org+"</h2>");
		}
		
		$("#depList").append("<a href='javascript:plotMonthly(\""+data[item]["department"].value+"\",\""+data[item]["name"].value+"\")'>"+data[item]["name"].value+"</a>");
		$("#depList").append("</br>");
		
	}
	} else { console.log("Bug?"); }
	});
}

initialize();

function fixMonths(vizdata) {

var months = [ "01", "02", "03", "04", "05", "06","07", "08", "09", "10", "11", "12" ];

for(var i=0;i<vizdata.getNumberOfRows();i++)
  {
	var row = vizdata.getValue(i,0);
	var pMonth = parseInt(row,10);
	 
     // IF some month is missing add new row
     if(i+1 != pMonth) {
        vizdata.insertRows(i,1);
        vizdata.setValue(i,0,months[i]);
        vizdata.setValue(i,1,0);
       }
	else vizdata.setValue(i,0,months[i]);
}

// IF months missing from the end of the table
while(vizdata.getNumberOfRows()<12) {
      vizdata.addRow([months[vizdata.getNumberOfRows()], 0]);
}

return vizdata;

}

function plotMonthly(department,name) {
	
$("#lectures").html("<img src='load.gif' alt='loading ...'/>");

var bq = prefix+"SELECT xsd:string(?month) (count(?course) as ?lectures) where { <"+department+"> aiiso:teaches ?course . ?course teach:arrangedAt [ical:dtstart ?start].} GROUP BY (substr(str(?start),6,2) as ?month) ORDER BY ?month";
	
ajaxQuery(bq).done(function(data) {
//FIXME: Next line is for debugging only
//data = $.parseJSON(data);
if(data.results.bindings.length>2) {


var gData = bgraph.SparqlJSON2GoogleJSON(data);

if(vizdata!=null) {
	$("#title2").html(name);
	vizdata2 = new google.visualization.DataTable(gData);
	vizdata2 = fixMonths(vizdata2);
	vizdata = google.visualization.data.join(vizdata, vizdata2, 'full', [[0,0]], [1], [1]);
	
}
else { 
	$("#title").html(name);
	$("#title2").html("<- Select another");
	$("#title").css("visibility", "inherit");
	$("#title2").css("visibility", "inherit"); 
	$("#reset").css("visibility", "inherit"); 
	vizdata = new google.visualization.DataTable(gData);
	vizdata = fixMonths(vizdata);
}



viz = new google.visualization.LineChart($("#lectures")[0]);


options ={
		hAxis:  {title: 'Month',  showTextEvery: 1},
        vAxis: {title: 'Number of lectures',viewWindowMode: "explicit", viewWindow:{ min: 0 }},
		legend:"none",
		useFormatFromData:true,
		viewWindowMode:"pretty",
		curveType:"function",
		lineWidth:2,
		top: 0,
		left: 0,
		width: 600,
		height: 400,
		focusTarget: "category"
}

		
viz.draw(vizdata,options);

} else $("#lectures").html("<h2 style='color:red'>There is no temporal information of these courses!</h2>");

});
}



</script>

<?php require('post.inc'); ?>

